<template>
  <div id="app">
    <Navbar v-if="isUserPage" />
    <router-view />
    <theme-picker />
  </div>
</template>

<script>
import ThemePicker from "@/components/ThemePicker";
import Navbar from '@/components/Navbar'

export default {
  name: "App",
  components: { ThemePicker, Navbar },
  metaInfo() {
    return {
      title: this.$store.state.settings.dynamicTitle && this.$store.state.settings.title,
      titleTemplate: title => {
        return title ? `${title} - ${process.env.VUE_APP_TITLE}` : process.env.VUE_APP_TITLE
      }
    }
  },
  computed: {
    isUserPage() {
      // 获取当前角色
      const roleName = localStorage.getItem('roleName');
      // 获取当前路由路径
      const currentPath = this.$route.path;
      
      // 判断当前路由是否在用户页面范围内
      const userPages = [
        '/userHome', 
        '/square', 
        '/appointment', 
        '/feedback', 
        '/news2', 
        '/myOrders', 
        '/application2',
        '/words',
        '/feedback/my_words',
        '/hone/subject',
        '/teacherDetail',
        '/myRequest',
        '/news/detail'
      ]

      // 特殊处理 /user/profile 路径
      if (currentPath === '/user/profile') {
        // 如果是管理员，不显示导航栏
        if (roleName === '超级管理员') {
          return false;
        }
        // 如果是普通用户（教员或家长），显示导航栏
        return true;
      }

      // 其他路径按原有逻辑处理
      return userPages.includes(currentPath);
    }
  }
};
</script>

<style scoped>
#app .theme-picker {
  display: none;
}
</style>
